<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/lib/bootstrap.min.css" />
		<link rel="stylesheet" href="js/themes/default/easyui.css" />
		<script src="js/lib/jquery-1.11.0.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>	
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<style>
		body{
			font-size:12px;
		}
		table,
		th,
		td {
			border: 1px solid grey;
			border-collapse: collapse;
			padding: 5px;
			vertical-align: middle !important;
		}
		
		table td:nth-child(odd) {
			background-color: #f1f1f1;/*#e2e9ea*/
			
		}
		table td:nth-child(even) {
			
		}
		table tr:nth-child(even) {
			background-color:#ffffff;
		}
		input{
			width:280px;
		}
		span{
			width:20px;color:red;display:inline-block;text-align:center;
		}
		#sho{
			width:300px;
			height:50px;
			background:#d9534f;
			opacity:0.8;
			border-radius:8px;
			color:#fff;
			text-align: center;
			font-size:30px;
			position: absolute;
			top:0px;
			left:550px;
			display:none;
		}
	</style>
	<body>
		<div class="">
			<div id="sho"></div>
			<!--第一个查询-->
		<div style="padding:15px 5px 0px 5px;border:3px solid #ccc;margin-bottom:15px">
			<table class="table table-hover">
				
				<tbody>
					<tr>
						<th colspan="8">通道标识查询：</th>
					</tr>
					<tr>
						<td>通道标识:</td>
						<td colspan="8" style="overflow:hidden;">
							<select name="" class="form-control" id="q1" type="text" style="width:280px;">
								
								
							</select>
						</td>		
					</tr>					
					<tr>
						
						<td colspan="8">
								<button id="query1" class="btn btn-danger" style="margin:0 auto;display:block;">点击查询</button>  								
						</td>										
					</tr>
					<tr>
						<td style="width:200px;" class="text-center">通道标识</td>
						<td class="text-center">名称</td>
						<td class="text-center">最小金额</td>
						<td class="text-center">最大金额</td>
						<td class="text-center">单日最大金额</td>
						<td class="text-center">结算费率</td>
						<td class="text-center">结束时间</td>
					</tr>
					<tr id="show" style="display:none">
						<td class="text-center" id="show1"></td>
						<td class="text-center" id="show2"></td>
						<td class="text-center" id="show3"></td>
						<td class="text-center" id="show4"></td>
						<td class="text-center" id="show5"></td>
						<td class="text-center" id="show6"></td>
						<td class="text-center" id="show7"></td>
					</tr>
					<tr>
						<td colspan="8" id="show01" class="text-center" style="display:none;">
							
						</td>
					</tr>
				</tbody>
			</table>		
		</div>
		
		<!--第二个查询-->
		<div style="padding:15px 5px 0px 5px;border:3px solid #ccc;margin-bottom:15px">
			<table class="table table-hover">
				
				<tbody>
					<tr>
						<th colspan="8">获取通道费率：</th>
					</tr>
					<tr>
						<td>品牌编号:</td>
						<td colspan="3" style="overflow:hidden;">
							<input class="form-control" id="d1" type="text" />
						</td>
						<td>通道编号:</td>
						<td colspan="3" style="overflow:hidden;">
							<input class="form-control" id="d2" type="text" />
						</td>		
					</tr>					
					<tr>
						
						<td colspan="8">
								<button id="query2" class="btn btn-danger" style="margin:0 auto;display:block;">点击查询</button>  								
						</td>										
					</tr>
					<tr>
						<td class="text-center">ID</td>
						<td class="text-center">品牌编号</td>
						<td class="text-center">通道编号</td>
						<td class="text-center">用户ID</td>
						<td class="text-center">通道费率</td>						
						<td class="text-center">结束时间</td>
					</tr>
					<tr id="show-1" style="display:none">
						<td class="text-center" id="h1"></td>
						<td class="text-center" id="h2"></td>
						<td class="text-center" id="h3"></td>
						<td class="text-center" id="h4"></td>
						<td class="text-center" id="h5"></td>
						<td class="text-center" id="h6"></td>
					</tr>
					<tr>
						<td colspan="8" id="show02" class="text-center" style="display:none;">
							
						</td>
					</tr>
				</tbody>
			</table>		
		</div>
		</div>
	</body>
	<script>
		$(function(){
			  /*获取所有通道*/
	        $.ajax({
	            type:"POST",
	            url:window.baseUrl+"user/channel/query/all",
	            async:true,
	            dataType:"json",
	            data:{
	            },
	            success:function(data){               
	                console.log(data.result)
	                var html = "<option selected='selected' value=''>请选择通道</option>";
	                var vendorJson = eval(data.result);
	                for(var i=0; i<vendorJson.length; i++){
	                html += "<option value= '"+vendorJson[i].id+"'>"+vendorJson[i].name+'--'+vendorJson[i].channelParams+"</option>";
	                }
	                $("#q1").html('').append(html);
	               
	            },
	            error:function(data){
	                alert('失败')
	            }
	        })
			/*根据渠道标识查询*/
			$("#query1").click(function(){
				var q1 = $("#q1").val();
				$.ajax({
					type:"POST",
					url:window.baseUrl+"user/channel/query",
					dataType:"json",
					data:{
						channel_tag:q1
					},
					success:function(data){
						console.log("开始远程调用。。。")
						console.log(data)
						console.log(data.result)
						var msg = data.result
						if(data.result == null){
							$('#show').hide()
							$("#show01").show().html("暂无数据。。")							
						}else{
							$('#show01').hide()
							$('#show').show()
							$('#show1').html(msg.channelTag)
							$('#show2').html(msg.name)
							$('#show3').html(msg.singleMinLimit)
							$('#show4').html(msg.singleMaxLimit)
							$('#show5').html(msg.everyDayMaxLimit)
							$('#show6').html(msg.rate)
							$('#show7').html(msg.createTime)							
						}						
					},
					error:function(){
						console.log("调用失败！")
					}

				})
			})
			/*获取渠道费率*/
			$('#query2').click(function(){
				var d1 = $("#d1").val();
				var d2 = $("#d2").val();
				$.ajax({
					url:window.baseUrl+"user/channel/rate/query/brandid",
					type:"POST",
					data:{
						brand_id:d1,
						channel_id:d2
					},
					dataType:"json",
					success:function(data){
						console.log("开始远程调用。。。")
						console.log(data);
						console.log(data.result)
						var msg = data.result
						if(data.result == null){
							$('#show-1').hide()
							$("#show02").show().html("暂无数据。。")	
						}else{
							$('#show02').hide()
							$('#show-1').show()
							$('#h1').html(msg.id)
							$('#h2').html(msg.brandId)
							$('#h3').html(msg.channelId)
							$('#h4').html(msg.userId)
							$('#h5').html(msg.rate)
							$('#h6').html(msg.createTime)
						}			
					},
					error:function(){
						console.log("调用失败！")
						$('#show-1').hide()
						$("#show02").show().html("暂无数据...")	
					}
				})
			})
			
		})
	</script>
</html>



